<template>
    <div>
        <div id="box">
            <span>品牌推荐</span>
        </div>
        <div id="main">
            <div v-for="n in tuijian" id="outer">
                <img :src="n.img">
            </div>
        </div>
    </div>
</template>

<script>
import {mapState,mapGetters} from 'vuex';
export default {
     computed:{
        ...mapState([
            "tuijian"
        ])
    },
    mounted:function(){
        this.$store.dispatch("requesttuijian");
    }
}
</script>

<style scoped>
#box{
    width: 100%;
    height: 6vh;
     line-height: 6vh; 
    border:solid 1px #dbdbdb;
    color: black;
    font-size: 15px;
}
#main{
    width: 100%;
    height: 60vh;
    /* border:solid 1px black; */
    display: flex;
    flex-wrap: wrap;
}
#outer{
    cursor: pointer;
    width: 50%;
    height: 15vh;
    line-height: 13vh;
    text-align: center;
    border:solid 1px #dbdbdb;
}
img{
    width: 28vh;
}
</style>